<template>
  <div class="preWorkBox">
    <!-- 工位自检 -->
    <div class="content">
      <div class="contentDiv">
        <el-form ref="form" class="perForm" :model="form" label-width="auto" size="medium">
          <el-form-item label="SN码:" prop="sn">
            <el-input
              id="head-input"
              v-model="form.snCode"
              type="textarea"
              placeholder="请输入SN码"
              :autosize="{ minRows: 2, maxRows: 5 }"
              style="width: 400px; height: 50px"
              @input="snbutton"
            />
          </el-form-item>
          <!-- <el-form-item label="审核不合格原因:" prop="sn">
            
          </el-form-item>-->
          <div
            style="margin-bottom: 15px;"
            v-if="stationCheckExamineList && stationCheckExamineList.length>0 && stationCheck.wfState != '3'"
          >
            <p>审核不合格原因：</p>
            <p v-for="(item,i) in this.stationCheckExamineList " :key="i">{{ item.examineReason }}</p>
          </div>
          <div style="margin-bottom: 15px;color:red" v-if=" stationCheck.wfState == '3'">
            <p>该SN已自检合格！！！</p>
          </div>
        </el-form>
        <el-table v-loading="loading" :data="templateList" v-if=" stationCheck.wfState != '3'">
          <el-table-column type="index" width="80" label="序号"></el-table-column>
          <el-table-column
            label="检查项目"
            align="center"
            prop="checkItem"
            class-name="tableLi"
            width="240"
          />
          <el-table-column
            label="所属工序"
            align="center"
            prop="workSequenceName"
            class-name="tableLi"
            width="240"
          />
          <el-table-column
            label="检验类型"
            align="center"
            prop="checkTypeName"
            class-name="tableLi"
            width="240"
          />
          <el-table-column label="检查结果" align="center" prop="checkResult" width="240">
            <template slot-scope="scope">
              <div>
                <el-checkbox
                  v-model="scope.row.checkResult"
                  true-label="1"
                  false-label="0"
                  :disabled="disables"
                  @change="(value)=>checkChange(value,scope.$index)"
                ></el-checkbox>
                <!-- <el-radio-group v-model="scope.row.inspectionResult" @input="checkChange">
                  <el-radio :label="1" value="1">√</el-radio>
                  <el-radio :label="0" value="0">×</el-radio>
                </el-radio-group>-->
              </div>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>
    <div class="dialog_footer" v-if=" stationCheck.wfState != '3'">
      <!-- <el-button @click="reset" style="font-size: 24px;">重 置</el-button> -->
      <el-button type="primary" style="font-size: 24px;" @click="submitForm">提交审核</el-button>
    </div>
  </div>
</template>
    
  <script>
// failsafeList  13008
import { getAlllist, getResult, stationCheckDetails } from "@/api/apppro/index";
import moment from "moment";
export default {
  name: "selfInspection",
  props: {
    formObj: Object
  },
  data() {
    return {
      form: {},
      loading: false,
      templateList: [],
      stationCheckExamineList: [],
      stationCheck: {},
      disables: false,
      startTime:null,
    };
  },

  created() {
    // this.getCode();
    // this.getList();
  },
  methods: {
    getList() {
      this.loading = true;
      let params = {};
      params.productId = this.formObj.productId;
      //     params.productType = this.formObj.productType;
      params.processId = this.formObj.processId;
      //     params.processCode = this.formObj.processCode;
      //     params.productCode = this.formObj.productCode;
      console.log(this.formObj, "===== this.formObj=====");
      getAlllist(params).then(response => {
        this.loading = false;
        this.templateList = response;
      });
    },

    submitForm() {
      console.log(this.templateList, "=======this.templateList=====");
      for(let i=0;i<this.templateList.length;i++){
        if(this.templateList[i].checkResult !=='1'){
          this.$notify({
                title:'提示',
                type:'warning',
                message: '需全部检查!'
            });
            return;
        }
      }
      this.form.stationCheckConfDetails = this.templateList;
      this.form.proWorkorder = this.formObj;
      this.form.snCode = this.form.snCode.replace(/[ ]|[\r\n]/g, "");
      this.form.startTime = this.startTime
      getResult(this.form).then(res => {
        console.log(res, "=======res=======");
        this.$modal.msgSuccess(res.msg);
      });
    },

    snbutton(e) {
      var myInputOrder = document.getElementById("head-input");
      myInputOrder.onkeydown = even => {
        console.log(even, "=====e=====");
        if (even.key == "Enter") {
          //赋值给v-model
          this.form.snCode = e;
          this.form.workstationCode = this.formObj.workstationCode;
          this.form.workstationId = this.formObj.workstationId;
          this.form.workPosition = this.formObj.workstationName;
          this.form.workSequenceCode = this.formObj.processCode;
          this.form.workSequenceName = this.formObj.processName;
          this.startTime= moment().format("YYYY-MM-DD HH:mm:ss");
          console.log(this.startTime,"=======time======");
          let param = {
            snCode: this.form.snCode,
            workPosition: this.formObj.workstationName
          };
          stationCheckDetails(this.form).then(res => {
            if (res.code == 200) {
              this.templateList = res.data.stationCheckConfDetails || [];
              this.stationCheckExamineList =
                res.data.stationCheckExamineList || [];
              // this.form.proWorkorder = res.data.proWorkorder || {};
              this.stationCheck = res.data.stationCheck || {};
              this.templateList.forEach(item => {
                if (!item.checkResult) {
                  item.checkResult = "0";
                }
              });
              console.log(res, "正常的res");
              console.log(this.formObj, "========this.formObj========");
              this.disables = true;
              setTimeout(() => {
                this.disables = false;
              }, 1000 * 10);
            }
          });
        }
      };
    },
    checkChange(e, index) {
      //   this.templateList[index].checkResult = 1;
      this.disables = true;
      setTimeout(() => {
        this.disables = false;
      }, 1000 * 10);
      // let obj = this.templateList[index];
      // console.log(e, index,obj, "==========e  index=====");
      // this.$set(this.templateList, index, obj);
    }
  }
};
</script>
  <style rel="stylesheet/scss" lang="scss" scoped>
.perForm ::v-deep .el-form-item__label {
  font-size: 28px;
}

.contentDiv ::v-deep .el-alert__title {
  font-size: 20px;
}
.contentDiv ::v-deep .el-alert__icon {
  font-size: 20px;
}
.content {
  // margin-top: 20px;
  // text-align: center;
  display: flex;
  justify-content: center;
  // width: 100%;
}

.dialog_footer {
  width: 100%;
  text-align: center;
  margin-top: 20px;
  // display: flex;
  // justify-content: center;
}

.sn_box {
  text-align: left;
  margin-left: 10%;
  font-size: 20px;
  line-height: 40px;
}
</style>
    